<template>
    <div>
        <el-table ref="ClothingWarningTablesRef" v-loading="loading" :data="ClothingSendWarningListTables"
            @selectionChange="selectChangeHandle" show-overflow-tooltip v-model="isShow" border stripe
            :row-style="tableRowStyle">
            <el-table-column label="服装装备名称" prop="clothName" />
            <el-table-column label="发放日期" prop="senddate" />
            <!-- <el-table-column label="发放备注" prop="remark"/>-->
            <el-table-column label="有效期（年）" prop="youxiaoqi" />
            <el-table-column label="计量单位" prop="jiiangdanwei" width="80">
                <template #default="scope">
                    <dict-tag :options="nj_jiliangdanwei" :value="scope.row.jiiangdanwei" />
                </template>
            </el-table-column>
            <!-- <el-table-column label="申请人" prop="adduser_id" width="120"/>
            <el-table-column label="申请日期" prop="adddate" width="160"/>
            <el-table-column label="承办人意见" prop="applydetail"/>
            <el-table-column label="状态" prop="state" >
                <template #default="scope">
                    <dict-tag :options="nj_policeapply_status" :value="scope.row.state" />
                </template>
            </el-table-column> -->
            <el-table-column fixed="right" label="操作" width="140">
                <template #default="scope">
                    <el-button link size="small" type="primary"
                        @click="AddEditUsePoliApplRef.showEditUsePoliAppl(scope.row, '用警申请-法警负责人审批', '2', 'Edit')">
                        <el-icon class="me-1">
                            <Edit />
                        </el-icon>
                        编辑
                    </el-button>
                    <el-button link size="small" type="primary"
                        @click="AddEditUsePoliApplRef.showEditUsePoliAppl(scope.row, '用警申请-信息查看', '2', 'View')">
                        <el-icon class="me-1">
                            <Edit />
                        </el-icon>
                        查看
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
        <pagination v-show="total > 0" v-model:page="paging.pageNum" v-model:limit="paging.pageSize" :total="total"
            @pagination="getClothingSendLists" />
        <AddEditUsePoliAppl ref="AddEditClothingSendRef" @getClothingSendLists="getClothingSendLists" />
    </div>
</template>
<script setup>
import { getCurrentInstance } from "vue";
import { PoliceApplydepList } from "@/api/UserPoliAppl/UserPoliAppl";
import { getClothingSendWarningList } from "@/api/ClothingSendManage/ClothingSend";
import AddEditUsePoliAppl from "@/components/UserPoli/UserPoli.vue";
import PageEnum from "@/enum/PageEnum.js";
const { proxy } = getCurrentInstance();

const { nj_jiliangdanwei, nj_anjian_status } = proxy.useDict('nj_jiliangdanwei', 'nj_anjian_status')

const ClothingProvideTablesRef = ref()
const total = ref(0)
const isShow = ref(false)
const deleteStatus = ref(true)
const AddEditUsePoliApplRef = ref({})
const loading = ref(false)
const paging = ref({
    // 页码
    pageNum: 1,
    // 分页数量
    pageSize: PageEnum.SIZE
})
const queryParams = ref({
    type: '1'

})

const ClothingSendWarningListTables = ref([])
onMounted(() => {
    getClothingSendLists()
})
// 斑马纹样式函数
const tableRowStyle = ({ row, rowIndex }) => {
    if (rowIndex % 2 === 0) {
        return { backgroundColor: '#e6ecff' }; // 偶数行背景色
    }
    return {}; // 奇数行默认透明
}
const changeShowStatus = () => {
    isShow.value = !isShow.value
}

const showWarningApply = (Params) => {
    changeShowStatus()
    queryParams.value.depname = Params
    getClothingSendLists()

}
const getClothingSendLists = async () => {
    loading.value = true
    await getClothingSendWarningList(queryParams.value, paging.value).then(res => {
        console.log(res)
        ClothingSendWarningListTables.value = res.rows
        total.value = res.total
        loading.value = false
    })
}

const selectChangeHandle = (data) => {
    deleteStatus.value = data.length === 0;
}
defineExpose({ showWarningApply })

</script>
<style lang="scss" scoped>
/* 保留斑马纹的同时添加悬停效果 */
:deep().el-table--striped .el-table__body tr.el-table__row--striped:hover td {
  background-color: #a5b8f4; /* 悬停时的红色 */
}

:deep().el-table__body tr:hover td {
  background-color: #a5b8f4; /* 悬停时的红色 */
}</style>